<template>
	<div class="page"  @click="closePop">
		<div id="page">
		<!-- <div class="top">
			<div style="float:left;"><span @click="goBack" class="goback">模板管理</span>　|　<span>添加V5模板</span></div>
			<el-button type="primary" size="small" id="goback" @click="goBack">返回</el-button>
		</div> -->
		<el-form :model="form" inline id="addform" style="text-align:left;">
			<el-form-item label="模板名称:" autofocus :label-width="formLabelWidth" style="height:1rem;line-height:1rem;">
				<el-input v-model="form.name" auto-complete="off" class="inpu" placeholder="输入模板名称"></el-input>
			</el-form-item>
			<el-form-item label="备注说明:" :label-width="formLabelWidth" style="height:1rem;line-height:1rem;">
				<el-input v-model="form.info" auto-complete="off" class="inpu mark"  type="text" placeholder="请输入说明内容"></el-input>
			</el-form-item>
			<el-form-item :label-width="formLabelWidth" style="margin-top:-0.5rem;">
				<el-form :model="dynamicValidateForm" ref="dynamicValidateForm" inline class="boxSensor" >
					<el-form-item style="margin-bottom:0.1rem;">
						<el-button @click="addDomain" type="primary" size="small">新增数据点</el-button>
						<el-button type="primary" size="small" v-if="isManyAdd" @click="copyDomain(dynamicValidateForm.domains[dynamicValidateForm.domains.length-1])">批量新增</el-button>
						<!-- <el-button type="primary" size="small" v-if="!more" @click="showMore">显示附加属性</el-button>
						<el-button type="primary" size="small" v-else @click="hiddenMore">隐藏附加属性</el-button> -->
						<el-button type="success" size="small" @click="addMould">保存</el-button>
						<el-button type="primary" size="small" @click="resetForm">重置</el-button>
						<!-- <el-button v-if="dynamicValidateForm.domains[0].sensor_name && dynamicValidateForm.domains[0].data_key" @click="copyDomain(dynamicValidateForm.domains[dynamicValidateForm.domains.length-1])"
						 type="primary" size="small">复制</el-button> -->
						<!-- <el-button @click="resetForm('dynamicValidateForm')">重置</el-button> -->
						<span class="tip">名称和地址必须唯一,名称用于显示和选择,地址用于数据传输,排序决定显示顺序。所有操作保存后才可生效。V5模板只能用于V5网关设备！</span>
					</el-form-item>
					<div class="sensorHead" ref="sensorHead">
						<span class="inpu_4" style="width:1rem;height:0.8rem;">图标</span>
						<span class="inpu_4" style="width:3.5rem;">名称</span>
						<div class="inpu_4" style="width:2.6rem;" >
							<span>地址</span>
							<el-tooltip placement="top" effect="light">
							  <div slot="content" style="line-height:0.4rem;color:red;">注意事项:<br/>地址必须遵守相应协议规则，并以数据分区(数据通道)为前缀(如：0x,1x,3x,4x,I,Q,M,V,D(DB),X,Y等,注意字母大小写！</div>
							  <span class="sortIcon" style="color:red;">!</span>
							</el-tooltip>
						</div>
						<!-- <span class="inpu_4" style="width:2.6rem;">地址</span> -->
						<span class="inpu_4" style="width:2.4rem;">数值类型</span>
						<span class="inpu_4" style="width:1.5rem;">倍数</span>
						<span class="inpu_4" style="width:1.5rem;">偏置</span>
						<span class="inpu_4" style="width:1.7rem">小数位</span>
						<span class="inpu_4" style="width:1.5rem;">阈值</span>
						<span class="inpu_4" style="width:3rem">数据属性</span>
						<div class="inpu_4" style="width:2.2rem;" >
							<span>单位</span>
							<el-tooltip placement="top" effect="light">
							  <div slot="content" style="line-height:0.4rem;color:red;">注意事项:<br/>为了体现专业化和减少占位长度以方便显示，尤其是手机端的显示，单位请使用数学写法，勿使用汉字！</div>
							  <span class="sortIcon" style="color:red;">!</span>
							</el-tooltip>
						</div>
						<span class="inpu_4" style="width:2.6rem;">读写/显示</span>
						<!-- <span class="inpu_4" style="width:2.2rem;">读写属性</span> -->
						<!-- <span class="inpu_4" style="width:2.1rem;">存储</span> -->
						<div class="inpu_4" style="width:1.8rem;">
							<span>存储</span>
							<el-tooltip placement="top" effect="light">
							  <div slot="content" style="line-height:0.4rem;color:red;">注意事项:<br/>如果选择不存储，该数据点将没有历史数据和历史曲线！</div>
							  <span class="sortIcon" style="color:red;">!</span>
							</el-tooltip>
						</div>
						<!-- <span class="inpu_4" style="width:2.8rem">单位</span> -->
						
						
						<!-- <span class="inpu_4" style="width:1.6rem;">阈值</span> -->
						
						<!-- <span class="inpu_4" style="width:3.8rem">附加参数</span> -->
						<!-- <div class="inpu_4" style="width:4rem;" v-show="more">
							<span>附加参数</span>
							<el-tooltip placement="top" effect="light">
							  <div slot="content" style="line-height:0.4rem;">说明:<br/>1.目前只适用于多位开关,支持2至5个选项;<br/>2.长度限制：所有选项的名称加起来不超过16个汉字;<br/>3.格式：值:名称,值:名称，如："0:1档,1:2档,2:3档"</div>
							  <span class="sortIcon">?</span>
							</el-tooltip>
						</div> -->
						
						
						<!-- <span class="inpu_4" style="width:2rem;">排序</span> -->
						<div class="inpu_4" style="width:1.8rem;">
							<span>排序</span>
							<el-tooltip placement="top" effect="light">
							  <div slot="content" style="line-height:0.4rem;">支持的排序写法:<br/>1.数字:如:0,1,2,3,...;<br/>2.小写字母+数字:如:a1,a2,a3,...,b1,b2,b3,...</div>
							  <span class="sortIcon">?</span>
							</el-tooltip>
						</div>
						<span class="inpu_4" style="width:1rem" v-if="dynamicValidateForm.domains.length>1">操作</span>
					</div>
					<el-form-item v-for="(domain, index) in dynamicValidateForm.domains" class="oneDomain" :prop="'domains.' + index + '.sensorName'"
					 :key="index">
						<el-popover placement="top" width="210" style="z-index:9999;height:210px;line-height:70px;" trigger="manual"
						 v-model="domain.visible">
							<img v-for="(i) in 18" :key="i" :src="baseurl+'static/images/icon/icon'+i+'.png'" class="thumb" style="margin-left:0.27rem;margin-bottom:0.2rem;"
							 :id="i" @click="chooseIcon(i,index)" />
							<el-button slot="reference" class="icon_btn" @click="getIndex(index)"><img v-if="domain.icon" :id="index" :src="baseurl+domain.icon"
								 class="thumb" /></el-button>
						</el-popover>
						<el-input class="inpu_3" style="width:3.5rem;" v-model="domain.sensor_name" placeholder="数据点名称" @blur="showTip_1(domain.sensor_name)"></el-input>
						<el-input class="inpu_3" v-model="domain.data_key" placeholder="地址"  style="width:2.4rem" @input="addressValueType(domain.data_key,index)" @blur="showTip_2(domain.data_key)"></el-input>
						<el-select v-model="domain.value_type" placeholder="数值类型" class="inpu_3" style="width:2.4rem">
							<el-option v-for="item in valueTypes" :key="item.value" :value="item.value" :label="item.label">
							</el-option>
						</el-select>
						<el-input class="inpu_3" style="width:1.4rem;" v-model="domain.magnification" placeholder="倍数"></el-input>
						<el-input class="inpu_3" style="width:1.4rem;" v-model="domain.value_offset" placeholder="偏置"></el-input>
						<el-select :disabled="domain.show_type>2" v-model="domain.decimals"  style="width:1.6rem" 
						 class="inpu_3">
							<el-option v-for="item in points" :key="item.value" :value="item.value" :label="item.label">
							</el-option>
						</el-select>
						<el-input class="inpu_3" style="width:1.4rem;" v-model="domain.threshold" placeholder="阈值"></el-input>
						<el-select  v-model="domain.report_type" placeholder="数据属性"
						 class="inpu_3" style="width:3rem;" @change="changeReportAdd(domain,index)">
							<el-option v-for="item in reportTypes" :key="item.value" :value="item.value" :label="item.label">
							</el-option>
						</el-select>
						<el-input :disabled="domain.show_type>2"  class="inpu_3"  style="width:2rem"  v-model="domain.unit" :placeholder="domain.show_type>2?'非数值,禁用':'单位,可无'"></el-input>
						<el-select v-if="domain.data_key[0]!='X'" v-model="domain.show_type" placeholder="读写/显示" class="inpu_3" style="width:2.4rem">
							<el-option v-for="item in options" :key="item.value" :value="item.value" :label="item.label">
							</el-option>
						</el-select>
						<el-select v-else v-model="domain.show_type" placeholder="读写/显示" class="inpu_3" style="width:2.4rem">
							<el-option v-for="item in optionsOnlyRead" :key="item.value" :value="item.value" :label="item.label">
							</el-option>
						</el-select>
						<!-- <el-select v-model="domain.read_write" placeholder="读写控制" class="inpu_3" style="width:2rem;">
							<el-option v-for="item in readWrites" :key="item.value" :value="item.value" :label="item.label">
							</el-option>
						</el-select> -->
						<el-select v-model="domain.save_type" placeholder="是否存储" class="inpu_3" style="width:2rem;">
							<el-option v-for="item in saves" :key="item.value" :value="item.value" :label="item.label">
							</el-option>
						</el-select>
						<!-- <el-input :disabled="domain.show_type!=6" class="inpu_3" style="width:3.8rem;" maxlength="30" v-model="domain.ext_vars" placeholder="格式:0:1档,1:2档,2:3档" v-show="more"></el-input> -->
						<el-input class="inpu_3" style="width:1.4rem;" v-model="domain.list_order" placeholder="排序" @blur="showTip_3(domain.list_order)"></el-input>
						<el-button @click.prevent="removeDomain(domain)" type="danger" size="mini" v-if="dynamicValidateForm.domains.length>1">删除</el-button>
					</el-form-item>
				</el-form>
			</el-form-item>

		</el-form>
		<!-- <el-dialog :visible="dialogFormVisible" width="25%" append-to-body>
			<div class="toptit">
				<span>复制{{copyitem.sensor_name}}</span>
				<span style="float:right;cursor: pointer;" @click="dialogFormVisible=false">关闭</span>
			</div>
			<el-form :model="copyForm" style="text-align:left;" block>
				<el-form-item class="formline" label="数　　　　量:" :label-width="formLabelWidth">
					<el-input class="inpu_3" v-model="copyForm.num" placeholder="请输入数量"></el-input><br>
				</el-form-item>
				<span style="color:red;">注:以最后一个节点为母本，单次数量1—100个,不支持节点名称和键名以"0"(零)为开头的复制操作</span>
			</el-form>
			<div class="dialog-footer" style="text-align: right;">
				<el-button type="success" class="btn" @click="sureCopy">确 定</el-button>
				<el-button type="primary" class="btn" @click="cancelCopy">取 消</el-button>
			</div>
		</el-dialog> -->
		<el-dialog :visible="dialogFormVisible" width="20%" append-to-body :show-close="close">
			<div class="toptit">
				<span>批量新增</span>
				<span style="float:right;cursor: pointer;" @click="dialogFormVisible=false">关闭</span>
			</div>
			<el-form :model="copyForm" style="text-align:left;" inline>
				<el-form-item class="formline" label="数　　量:" >
					<el-input class="inpu_3" style="width:2rem;" v-model="copyForm.num" placeholder="请输入数量"></el-input><br>
				</el-form-item><br>
			    <span style="color:red;">注:以末尾数据点为母本，单次数量3—100个</span>
			</el-form>
			<div style="text-align: right;margin-top:0.2rem;">
				<el-button type="success" size="small" @click="sureCopy">确 定</el-button>
				<el-button type="primary" size="small" @click="cancelCopy">取 消</el-button>
			</div>
		</el-dialog>
		</div>
	</div>
</template>

<script>
    import {
        reportTypes,
        saves,
        options,
		optionsOnlyRead,
        points,
        valueTypes_IQ,
        valueTypes_MV,
        valueTypes_01,
        valueTypes_34,
		valueTypes_Fx_D,
		valueTypes_T645,
        padLeft,
		createDataKey
    } from '@/common.js';
    export default {
        name: 'addMould',
        data() {
            return {
                formLabelWidth: '2.1rem',
                close: false,
                timeOne: new Date(2016, 9, 10, 18, 40),
                timeTwo: '',
                timeThree: '',
                queryParams: {
                    pageNo: 1,
                    pageSize: 10,
                    total: 0
                },
                more: false,
                oneValue: true,
                baseurl: this.$baseurl,
                iconurl: '',
                twoValue: false,
                threeValue: false,
                num: 600,
                num_2: 500,
                copyitem: {},
                cancopy: true,
                copyForm: {
                    num: 3
                },
                sensors: [],
				domainIndex: 0,
                formLabelWidth2: '70px',
                dialogFormVisible: false,
                dialogFormVisible_2: false,
                dialogVisible: false,
                dynamicValidateForm: {
                    domains: [{
                        //key: new Date().getTime(),
                        sensor_name: "数据点1",
                        data_key: '0x00001',
                        value_type: 0,
                        show_type: 4,
                        //read_write: 1, //1只读，2读写
                        save_type: 2, //1存储，2不存储，3变化存储
                        unit: '',
                        // ext_vars:'',
                        magnification: 1,
                        value_offset: 0,
                        threshold: 0,
                        report_type: 0,
                        list_order: 1,
                        decimals: 0,
                        visible: false,
                        icon: 'static/images/icon/icon1.png'
                    }],

                },
                reportTypes: reportTypes,
                isManyAdd:true,
                saves: saves,
                options: options,
				optionsOnlyRead:optionsOnlyRead,
                points: points,
                //i,q区数值类型一样
                valueTypes_IQ: valueTypes_IQ,
                //m,v,db区数值类型一样
                valueTypes_MV: valueTypes_MV,
                //modBus的0区1区数值类型只有布尔型
                valueTypes_01: valueTypes_01,
                //modBus的3区4区数值类型
                valueTypes_34: valueTypes_34,
				valueTypes_Fx_D:valueTypes_Fx_D,
				valueTypes_T645:valueTypes_T645,
                valueTypes: [],
                form: {
                    name: '',
                    info: ''
                        // set:'',
                        // oper:''
                }
            }
        },
        created() {
            this.valueTypes = this.valueTypes_01;
        },

        methods: {
            changeReportAdd(domain) {
                if (domain.report_type == 1) {
                    domain.save_type = 2;
                }
            },

            showTip_1(name) {
                if (!name) {
                    this.$message({
                        message: '数据点名称不能为空!',
                        type: 'error',
                        center: true
                    });
                }
            },
            showTip_2(key) {
                if (!key) {
                    this.$message({
                        message: '数据点地址不能为空!',
                        type: 'error',
                        center: true
                    });
                }
            },
            showTip_3(order) {
                if (!order) {
                    this.$message({
                        message: '排序不能为空!',
                        type: 'error',
                        center: true
                    });
                }
            },
            resetForm() {
                for (var key in this.form) {
                    this.form[key] = "";
                }
                for (var i = 0; i < this.dynamicValidateForm.domains.length; i++) {
                    for (var key in this.dynamicValidateForm.domains[i]) {
                        this.dynamicValidateForm.domains[i][key] = "";
                    }
                    this.dynamicValidateForm.domains[i].show_type = 4;
                    this.dynamicValidateForm.domains[i].value_type = 0;
                    this.dynamicValidateForm.domains[i].decimals = 0;
                    //this.dynamicValidateForm.domains[i].read_write = 1;
                    this.dynamicValidateForm.domains[i].save_type = 2;
                    this.dynamicValidateForm.domains[i].report_type = 0;
                    this.dynamicValidateForm.domains[i].visible = false;
                    this.dynamicValidateForm.domains[i].icon = 'static/images/icon/icon1.png';
                }
            },

            removeDomain(item) {
                var index = this.dynamicValidateForm.domains.indexOf(item)
                if (index !== -1) {
                    this.dynamicValidateForm.domains.splice(index, 1)
                }
            },

            copyDomain(item) {
                this.dialogFormVisible = true;
                this.copyForm.num = 3;
                this.copyitem = item;

            },

            //排序有字母的累加算法；
            upListOrder(order, n) {
                let orderStr = order.toString();
                return orderStr.split(orderStr.replace(/[^0-9]/ig, "")).join('') + (
                    Number(orderStr.replace(/[^0-9]/ig, "")) + n + 1);
            },

            //名称有数字和非数字混杂(包括纯数字和纯非数字)的复制
            copyName(str, n) {
                // if(Number(str)){
                // 	//纯数字直接加1就可以了
                // 	return Number(str)+n;
                // }
                let strArr = str.split('');
                //非数字正则表达式；
                let reg = /\D/i;
                //var reg_2 = new RegExp("[\\u4E00-\\u9FFF]+","g");//中文正则
                let index = 0;
                //判断最后一个非数字字符的位置并记录,判断是否为0是为了键名的复制
                for (let m = 0; m < strArr.length; m++) {
                    if (reg.test(strArr[m])) {
                        index = m;
                    }
                }
                //console.log(index);
                //不包含停止位，所以要加1
                return str.substr(0, index + 1) + (Number(str.substr(index + 1)) + n);

            },

            sureCopy() {
                var that = this;
                var max = that.dynamicValidateForm.domains[0].list_order;
                for (var i = 0; i < that.dynamicValidateForm.domains.length; i++) {
                    max = max < that.dynamicValidateForm.domains[i].list_order ? that.dynamicValidateForm.domains[i].list_order : max;
                }

                if ((this.copyForm.num >= 3) && (this.copyForm.num <= 100)) {
                    var addrAndKeys = createDataKey(this.copyitem.data_key, this.copyitem.value_type, this.copyForm.num,false);
                    for (var i = 0; i < this.copyForm.num; i++) {
                        that.dynamicValidateForm.domains.push({
                            //key: new Date().getTime(),
                            //sensor_name:(that.copyitem.sensor_name.split(that.copyitem.sensor_name.replace(/[^0-9]/ig,"")).join('')+(Number(that.copyitem.sensor_name.replace(/[^0-9]/ig,""))+x)).padLeft(n), 
                            //data_key:(that.copyitem.data_key.split(that.copyitem.data_key.replace(/[^0-9]/ig,"")).join('')+(Number(that.copyitem.data_key.replace(/[^0-9]/ig,""))+x)).padLeft(m),
                            sensor_name: that.copyitem.sensor_name == that.copyitem.data_key ? addrAndKeys[i].data_key : that.copyName(that.copyitem.sensor_name, i + 1),
                            data_key: addrAndKeys[i].data_key,
                            list_order: Number(max) ? max + i + 1 : that.upListOrder(max, i),
                            unit: that.copyitem.unit,
                            //ext_vars:that.copyitem.ext_vars,
                            decimals: that.copyitem.decimals,
                            icon: that.copyitem.icon,
                            report_type: that.copyitem.report_type,
                            magnification: that.copyitem.magnification,
                            value_offset: that.copyitem.value_offset,
                            threshold: that.copyitem.threshold,
                            visible: false,
                            show_type: that.copyitem.show_type,
                            value_type: addrAndKeys[i].value_type,
                            //read_write: that.copyitem.read_write,
                            save_type: that.copyitem.save_type
                        });


                    }
                    setTimeout(function() {
                        that.tobottom();
                    }, 600);

                } else {
                    this.$message({
                        message: '数量超出范围,无法批量添加!',
                        type: 'error',
                        center: true
                    });
                }
                this.dialogFormVisible = false;
            },

            cancelCopy() {
                this.dialogFormVisible = false;
            },

            removeDomain(item) {
                var index = this.dynamicValidateForm.domains.indexOf(item)
                if (index !== -1) {
                    this.dynamicValidateForm.domains.splice(index, 1)
                }
            },

            repartValueType(firstKey,type) {
				//三菱fx协议对应地址规则专用正则
				let regFx=/^[XYMD][0-9]{4,5}$/;
				let reg645=/^[0-9]{4,8}$/;
				if(!regFx.test(firstKey) && !reg645.test(firstKey)){
					this.isManyAdd=true;
					switch (type) {
						case '0':
						case '1':
							this.valueTypes = this.valueTypes_01;
							break;
						case '3':
						case '4':
							this.valueTypes = this.valueTypes_34;
							break;
						case 'I':
						case 'Q':
							this.valueTypes = this.valueTypes_IQ;
							break;
						case 'M':
						case 'V':
						case 'D':
							this.valueTypes = this.valueTypes_MV;
							break;
					}
				}else if(reg645.test(firstKey)){
					this.isManyAdd=false;
					this.valueTypes = this.valueTypes_T645;
				}else if(regFx.test(firstKey)){
					//X,Y为八进制，M,D为十进制
					this.isManyAdd=true;
					switch (type) {
						case 'X':
						case 'Y':
						case 'M':
						    this.valueTypes = this.valueTypes_01;
						    break;
						case 'D':
							this.valueTypes = this.valueTypes_Fx_D;
							break;
					}
				}
			},


            // //添加数据点时，数据通道变化引起数值类型选项变化；
            // chooseValueType(type) {
            // 	this.repartValueType(type);
            // 	this.addForm.value_type = this.valueTypes[0].value;
            // },

            //编辑数据点时，根据地址对应数值类型选项；
            addressValueType(address, i) {
                var type = address ? address[0] : '0';
				var reg=/^D[0]{5,}/;
				if(reg.test(address)){
					this.$message({
						type:'error',
						message:'输入地址不合法！'
					})
					return
				}
                this.repartValueType(address,type);
                this.dynamicValidateForm.domains[i].value_type = this.valueTypes[0].value;
				if (['M', 'V', '0','Y'].indexOf(type) >= 0) {
					this.dynamicValidateForm.domains[i].show_type=this.options[3].value;
					this.dynamicValidateForm.domains[i].threshold = 1;
				} else if(type=='X'){
					this.dynamicValidateForm.domains[i].show_type=this.optionsOnlyRead[2].value;
					this.dynamicValidateForm.domains[i].threshold = 1;
				}else {
					this.dynamicValidateForm.domains[i].show_type = this.options[0].value;
					this.dynamicValidateForm.domains[i].threshold = 0;
				}
				
            },


            addDomain() {
                var that = this;
                var max = that.dynamicValidateForm.domains[0].list_order;
                for (var i = 0; i < that.dynamicValidateForm.domains.length; i++) {
                    max = max < that.dynamicValidateForm.domains[i].list_order ? that.dynamicValidateForm.domains[i].list_order : max;
                }
                this.dynamicValidateForm.domains.push({
                    //key: new Date().getTime(),
                    sensor_name: '',
                    data_key: '',
                    show_type: 4,
                    //read_write: 1,
                    save_type: 2,
                    value_type: 0,
                    unit: '',
                    //ext_vars:'',
                    report_type: 0,
                    magnification: 1,
                    value_offset: 0,
                    threshold: 0,
                    list_order: Number(max) ? max + 1 : that.upListOrder(max, 0),
                    decimals: 0,
                    visible: false,
                    icon: 'static/images/icon/icon1.png'
                });
                setTimeout(function() {
                    that.tobottom();
                }, 500);
			},
            
			changeNum(value) {
                console.log(value);
            },
            goBack() {
                // localStorage.setItem("show",true)
                this.$router.push({
                    path: '/mould',
                    name: 'mould',
                    component: 'mould'
                });
            },
            getIndex(ind) {
                // console.log(ind);
                this.domainIndex = ind;
                this.dynamicValidateForm.domains[ind].visible = true;
                event.stopPropagation();
            },
            closePop() {
                this.dynamicValidateForm.domains[this.domainIndex].visible = false;
                event.stopImmediatePropagation();
            },
            chooseIcon(id, ind) {
                var that = this;
                var iconurl = 'static/images/icon/icon' + id + '.png';
                this.dynamicValidateForm.domains[ind].icon = iconurl;
                this.dynamicValidateForm.domains[ind].visible = false;
            },
            tobottom() {
                var content = document.getElementById("page");
                content.scrollTop = content.scrollHeight;
            },

            showMore() {
                this.more = true;
                this.$refs.sensorHead.style.width = "108%";
            },

            hiddenMore() {
                this.more = false;
                this.$refs.sensorHead.style.width = "99.4%";
            },

            addMould() {
                for (let i = 0, len = this.dynamicValidateForm.domains.length; i < len; i++) {
                    delete this.dynamicValidateForm.domains[i].visible;
                }
                // console.log(this.dynamicValidateForm.domains)
                this.$http({
                    method: 'post',
                    url: 'api/template/add',
                    data: {
                        "template_name": this.form.name,
                        "remark": this.form.info,
                        "version": 2,
                        "sensors": this.dynamicValidateForm.domains

                    }
                }).then(res => {
                    //console.log(res.data)
                    if (res && res.data.result == "success") {

                        this.$message({
                            message: '恭喜,添加模板成功!',
                            type: 'success',
                            center: true
                        });
                        this.$router.go(-1);
                    }

                }).catch(error => {
                    console.log(error)
                });

            }
        }

    }
</script>

<style scoped>
    @media all and (max-width:2560px) {
        .sensorHead {
            width: 100%!important;
        }
        .boxSensor {
            margin-left: 0.7rem!important;
        }
    }
    
    @media all and (max-width:1920px) {
        .sensorHead {
            width: 99.4%!important;
        }
        .boxSensor {
            margin-left: 0.7rem!important;
        }
    }
    
    @media all and (max-width:1600px) {
        #addform {
            margin-left: -0.3rem!important;
        }
        .boxSensor {
            margin-left: 0.4rem!important;
        }
        .mark {
            width: 23.2rem!important;
        }
        .oneDomain {
            margin-top: 0.2rem !important;
        }
    }
    
    @media all and (max-width:1366px) {
        #addform {
            width: 100%!important;
            margin-left: 0rem!important;
        }
        .boxSensor {
            margin-left: 0!important;
        }
        .tip {
            font-size: 0.4rem!important;
        }
    }
    
    /* .boxSensor {
        display: inline-block;
    } */
    
    .oneDomain>>>.el-input__inner {
        padding-left: 6px;
        padding-right: 2px;
    }
    
    .oneDomain>>>.el-select__caret {
        font-size: 12px;
    }
    
    .oneDomain>>>.el-input__icon {
        width: 14px;
    }
    
    #page {
        height: inherit;
        overflow: auto;
    }
    
    #addform {
        text-align: left;
        margin-top: 0.2rem;
        line-height: 1rem;
        width: 100%;
        margin-left: -0.5rem;
    }
    
    .boxSensor {
        float: left;
        margin-top: 0.1rem;
        width: 100%;
    }
    
    .sele {
        margin-bottom: 0 !important;
    }
    
    .inpu {
        width: 5rem;
        vertical-align: middle;
        transform: translateY(0.1rem)!important;
    }
    
    .inpu_3 {
        width: 3.5rem;
        margin-right: 0.1rem;
        vertical-align: middle;
    }
   
    .tip {
        color: red;
        font-size: 14px;
        margin-left: .2rem;
    }
    
    .dialog-footer {
        margin-top: 0.6rem;
        text-align: left;
        margin-left: 0.5rem;
    }
    
    .thumb {
        width: 0.8rem;
        height: 0.8rem;
        vertical-align: middle;
    }
    
    .icon_btn {
        width: 1rem;
        height: 0.8rem;
        vertical-align:middle;
        padding: 0;
        border: none;
    }
    
    .oneDomain {
        margin-left: 0.2rem;
        height: 1rem;
        line-height: 1rem;
        width: 98%;
        white-space: nowrap;
    }
    
    .inpu_4 {
        display: inline-block;
        text-align: center;
		margin-left:0;
		/* margin-right:0; */
        /* margin-right:0.2rem; */
        border: 0 !important;
        font-size: 0.35rem;
    }
    
    .sensorHead {
        height: 0.7rem;
        line-height: 0.7rem;
        /* border:1px solid red; */
        width: 99.6%;
        border-bottom: 1px solid #111;
        margin: 0.1rem 0 2px 0;
        padding: 0;
        padding-left: 0.2rem;
    }
    
    .mark {
        width: 400%!important;
    }
</style>